<!DOCTYPE html>
<html lang="en-US">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <title>HTML 学习 | 前端基础班学习笔记</title>
    <meta name="generator" content="VuePress 1.7.1">
    
    <meta name="description" content="前端基础班笔记">
    <meta name="theme-color" content="#3eaf7c">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    
    <link rel="preload" href="/basenode/assets/css/0.styles.2182318c.css" as="style"><link rel="preload" href="/basenode/assets/js/app.52c57e5d.js" as="script"><link rel="preload" href="/basenode/assets/js/2.fd1002bd.js" as="script"><link rel="preload" href="/basenode/assets/js/23.d7de44fa.js" as="script"><link rel="prefetch" href="/basenode/assets/js/10.0fd16134.js"><link rel="prefetch" href="/basenode/assets/js/11.69b32ff0.js"><link rel="prefetch" href="/basenode/assets/js/12.8306a2fe.js"><link rel="prefetch" href="/basenode/assets/js/13.bd409108.js"><link rel="prefetch" href="/basenode/assets/js/14.397fbca0.js"><link rel="prefetch" href="/basenode/assets/js/15.3ebf464d.js"><link rel="prefetch" href="/basenode/assets/js/16.18b0f270.js"><link rel="prefetch" href="/basenode/assets/js/17.aca32580.js"><link rel="prefetch" href="/basenode/assets/js/18.b36abbab.js"><link rel="prefetch" href="/basenode/assets/js/19.40fd0225.js"><link rel="prefetch" href="/basenode/assets/js/20.9c6d2a17.js"><link rel="prefetch" href="/basenode/assets/js/21.6d37b375.js"><link rel="prefetch" href="/basenode/assets/js/22.c01d802c.js"><link rel="prefetch" href="/basenode/assets/js/24.3470c223.js"><link rel="prefetch" href="/basenode/assets/js/3.924754cc.js"><link rel="prefetch" href="/basenode/assets/js/4.4eeb3907.js"><link rel="prefetch" href="/basenode/assets/js/5.88e4a4fd.js"><link rel="prefetch" href="/basenode/assets/js/6.ae7868e8.js"><link rel="prefetch" href="/basenode/assets/js/7.6ab91996.js"><link rel="prefetch" href="/basenode/assets/js/8.750a9450.js"><link rel="prefetch" href="/basenode/assets/js/9.26864b79.js">
    <link rel="stylesheet" href="/basenode/assets/css/0.styles.2182318c.css">
  </head>
  <body>
    <div id="app" data-server-rendered="true"><div class="theme-container"><header class="navbar"><div class="sidebar-button"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" viewBox="0 0 448 512" class="icon"><path fill="currentColor" d="M436 124H12c-6.627 0-12-5.373-12-12V80c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12zm0 160H12c-6.627 0-12-5.373-12-12v-32c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12zm0 160H12c-6.627 0-12-5.373-12-12v-32c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12z"></path></svg></div> <a href="/basenode/" class="home-link router-link-active"><!----> <span class="site-name">前端基础班学习笔记</span></a> <div class="links"><div class="search-box"><input aria-label="Search" autocomplete="off" spellcheck="false" value=""> <!----></div> <nav class="nav-links can-hide"><div class="nav-item"><a href="/basenode/html/" aria-current="page" class="nav-link router-link-exact-active router-link-active">
  HTML
</a></div><div class="nav-item"><a href="/basenode/css/" class="nav-link">
  CSS
</a></div> <!----></nav></div></header> <div class="sidebar-mask"></div> <aside class="sidebar"><nav class="nav-links"><div class="nav-item"><a href="/basenode/html/" aria-current="page" class="nav-link router-link-exact-active router-link-active">
  HTML
</a></div><div class="nav-item"><a href="/basenode/css/" class="nav-link">
  CSS
</a></div> <!----></nav>  <ul class="sidebar-links"><li><section class="sidebar-group collapsable depth-0"><p class="sidebar-heading open"><span>HTML</span> <span class="arrow down"></span></p> <ul class="sidebar-links sidebar-group-items"><li><a href="/basenode/html/" aria-current="page" class="active sidebar-link">HTML 学习</a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/basenode/html/#_1-day01-能力目标及课程结构" class="sidebar-link">1. day01 能力目标及课程结构</a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/basenode/html/#_1-1-day01-能力目标" class="sidebar-link">1.1 day01 - 能力目标</a></li><li class="sidebar-sub-header"><a href="/basenode/html/#_1-2-day01-课程结构" class="sidebar-link">1.2 day01 - 课程结构</a></li></ul></li><li class="sidebar-sub-header"><a href="/basenode/html/#_2-day02-能力目标及课程结构" class="sidebar-link">2. day02 能力目标及课程结构</a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/basenode/html/#_2-1-day02-能力目标" class="sidebar-link">2.1 day02 - 能力目标</a></li><li class="sidebar-sub-header"><a href="/basenode/html/#_2-2-day02-课程结构" class="sidebar-link">2.2 day02 - 课程结构</a></li></ul></li></ul></li><li><a href="/basenode/html/day01.html" class="sidebar-link">HTML 第 01 天</a></li><li><a href="/basenode/html/day02.html" class="sidebar-link">HTML 第 02 天</a></li><li><a href="/basenode/html/html-note.html" class="sidebar-link">HTML 笔记</a></li></ul></section></li></ul> </aside> <main class="page"> <div class="theme-default-content content__default"><h1 id="html-学习"><a href="#html-学习" class="header-anchor">#</a> HTML 学习</h1> <h2 id="_1-day01-能力目标及课程结构"><a href="#_1-day01-能力目标及课程结构" class="header-anchor">#</a> 1. day01 能力目标及课程结构</h2> <h3 id="_1-1-day01-能力目标"><a href="#_1-1-day01-能力目标" class="header-anchor">#</a> 1.1 day01 - 能力目标</h3> <ol><li>能够使用常用标签搭建基本网页结构，包括标题、段落、图像等；</li> <li>能够使用链接实现页面内和页面间的跳转。</li></ol> <h3 id="_1-2-day01-课程结构"><a href="#_1-2-day01-课程结构" class="header-anchor">#</a> 1.2 day01 - 课程结构</h3> <ol><li><strong>基础认知</strong>：<strong>知道</strong>前端工程师必备的一些常识性知识；</li> <li>☆<strong>常用 HTML 标签</strong>：<strong>应用</strong>常用 HTML 标签搭建网页基础结构；</li> <li><strong>综合案例</strong>：<strong>应用</strong>常用标签搭建简单网页（百科类）并实现页面内及页面间跳转。</li></ol> <h2 id="_2-day02-能力目标及课程结构"><a href="#_2-day02-能力目标及课程结构" class="header-anchor">#</a> 2. day02 能力目标及课程结构</h2> <h3 id="_2-1-day02-能力目标"><a href="#_2-1-day02-能力目标" class="header-anchor">#</a> 2.1 day02 - 能力目标</h3> <ol><li>能够使用<strong>表格标签及属性</strong>实现表格类结构的搭建，如<strong>个人简历</strong>；</li> <li>能够使用<strong>三种列表</strong>标签实现列表类结构的搭建，如<strong>技能列表</strong>、<strong>网站底部导航</strong>；</li> <li>能够使用<strong>表单及输入项</strong>实现表单类结构的搭建，如<strong>注册或登录表单</strong>。</li></ol> <h3 id="_2-2-day02-课程结构"><a href="#_2-2-day02-课程结构" class="header-anchor">#</a> 2.2 day02 - 课程结构</h3> <ol><li><strong>表格</strong>标签：<strong>应用</strong>表格标签实现表格结构<strong>搭建</strong>；</li> <li><strong>列表</strong>标签：<strong>应用</strong>三种列表标签实现三种列表结构<strong>搭建</strong>；</li> <li><strong>表单</strong>标签：<strong>应用</strong>表单输入项实现常规表单结构<strong>搭建</strong>；</li> <li>综合案例：<strong>应用</strong>表格、表单、列表标签实现「用户注册」页面结构的搭建。</li></ol></div> <footer class="page-edit"><!----> <!----></footer> <div class="page-nav"><p class="inner"><!----> <span class="next"><a href="/basenode/html/day01.html">
        HTML 第 01 天
      </a>
      →
    </span></p></div> </main></div><div class="global-ui"><!----></div></div>
    <script src="/basenode/assets/js/app.52c57e5d.js" defer></script><script src="/basenode/assets/js/2.fd1002bd.js" defer></script><script src="/basenode/assets/js/23.d7de44fa.js" defer></script>
  </body>
</html>
